<template>
  <div class="padding-20">
    <div class="bg-white padding-top-20 padding-left-right-20" id="baseInfo">
      <form-common :filed-list="topInfoList" ref="form"></form-common>
    </div>

    <div class="flex padding-top-bottom-15">
      <div class="font-size-16 font-weight-700 padding-left-20" style="width: 140px">合同信息</div>
      <div>
        <span class="font-size-16">合同总金额：</span>
        <span class="font-size-16" v-if="contractInfo.rentMode == 1">无固定金额</span>
        <span class="font-size-16" v-else>{{ (contractInfo.contractTotalAmount || 0) | moneyFilterNoUnit }}元</span>
      </div>
    </div>

    <div class="bg-white padding-top-bottom-15 padding-left-right-20" id="baseInfo">
      <form-common :filed-list="contractPayInfoList" ref="contractForm" @rightBtnFn="rightBtnFn"></form-common>
    </div>

    <!-- 合同文件 -->
    <div class="bg-white padding-top-20 padding-bottom-10 padding-left-right-20 margin-top-15">
      <div class="font-size-16 font-weight-700 padding-bottom-20" style="width: 140px">合同附件</div>
      <el-link class="margin-bottom-10" v-for="item in contractInfo.contractAttachmentList" :key="item.primaryKey" :underline="false" @click="downFile(item.fileUrl)">{{ item.fileDesc }}</el-link>
    </div>

    <!-- 签约方 -->
    <el-dialog title="签约方" :visible.sync="signDialogShow" width="1000px" :close-on-click-modal="false" :close-on-press-escape="false">
      <div class="border-b-line padding-bottom-15" :class="index != 0 ? 'padding-top-15' : ''" v-for="(item, index) in contractInfo.partnerList" :key="item.primaryKey">
        <div>
          <span class="label-width font-size-16">签约方名称：</span>
          <span class="font-size-16">{{ item.partnerName || '--' }}</span>
        </div>
        <div class="flex justify-between padding-top-10">
          <div class="flex-1 padding-right-20">
            <span class="label-width font-size-16">付款银行：</span>
            <span class="font-size-16">{{ item.paymentBank || '--' }}</span>
          </div>
          <div class="flex-1">
            <span class="label-width font-size-16">付款账号：</span>
            <span class="font-size-16">{{ item.paymentAccount || '--' }}</span>
          </div>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script>
  import { apiProjectList, apiDictMoreList, apiContractPayInfo } from '../../../api/contract';
  import { contractPayBaseInfoList, topInfoRefundList, contractPayInfoList } from './form';
  import formCommon from '@g/components/form/formCommon.vue';

  export default {
    name: 'infoPay',
    data() {
      return {
        topInfoList: contractPayBaseInfoList,
        contractPayInfoList: contractPayInfoList,
        contractType: this.$route.query.contractType,
        contractKey: this.$route.query.contractKey,
        contractCategory: this.$route.query.contractCategory, //1,收入 2,支出
        signDialogShow: false,
        contractInfo: {},
        dictoryList: [],
        systemType: localStorage.getItem('systemType'),
        constractStatusList: ['草稿', '审批中', '执行中', '驳回', '执行完毕', '已废止'],
      };
    },

    mounted() {
      this.getOptionList();
      this.getProjectList();
      this.getDataSource();
    },

    methods: {
      //数据源
      async getDataSource(more) {
        let res = await apiContractPayInfo({
          primaryKey: this.$route.query.contractKey,
        });
        res.chargeItemName = '';
        if (res.fundPlanList && res.fundPlanList.length > 0) {
          res.fundPlanList.forEach(item => {
            res.chargeItemName += item.chargeItemName + ',';
          });
        }
        res.chargeItemName = res.chargeItemName.substring(0, res.chargeItemName.length - 1);

        // //签约方
        let partnerName = '';
        res.partnerList.forEach(item => {
          partnerName += item.partnerName + '，';
        });
        res.partnerName = partnerName.substring(0, partnerName.length - 1);
        this.contractInfo = res;
        this.$refs.form.initModel();
        this.$refs.contractForm.initModel();
        this.initBaseInfo();
      },

      //字典
      async getOptionList() {
        let res = await apiDictMoreList({ dictTypeList: ['contractType', 'return_rent_type'] });
        this.dictoryList = res.rows || [];
        let contractTypeObj = res.rows.find(item => item.dictType == 'contractType');
        let returnRentTypeObj = res.rows.find(item => item.dictType == 'return_rent_type');
        this.topInfoList.forEach(item => {
          if (item.bindFieldName == 'contractType') {
            item.optionList = contractTypeObj.dictList || [];
          }
        });
        topInfoRefundList.forEach(item => {
          if (item.bindFieldName == 'returnRentType') {
            item.optionList = returnRentTypeObj.dictList || [];
          }
        });
      },

      //项目信息
      async getProjectList() {
        let res = await apiProjectList();
        this.topInfoList.forEach(item => {
          if (item.bindFieldName == 'projectKey') {
            item.optionList = res.rows || [];
          }
        });
      },

      //赋值表单一些基础值
      initStatusName() {
        this.topInfoList.forEach(item => {
          if (item.bindFieldName == 'statusName') {
            if (!this.contractInfo.contractStatus) {
              item.bindFieldVal = '草稿';
            } else {
              item.bindFieldVal = this.constractStatusList[Number(this.contractInfo.contractStatus)];
            }
          }
        });
      },

      //form数据回显
      initBaseInfo() {
        this.initStatusName();
        this.topInfoList.forEach(item => {
          for (let i in this.contractInfo) {
            if (item.bindFieldName == i) {
              item.bindFieldVal = this.contractInfo[i];
            }
          }
        });
        this.contractPayInfoList.forEach(item => {
          for (let i in this.contractInfo) {
            if (item.bindFieldName == i) {
              item.bindFieldVal = this.contractInfo[i];
            }
          }
        });
      },

      //下载文件
      downFile(url) {
        if (!url) return;
        let a = document.createElement('a');
        a.style.display = 'none';
        a.href = url;
        document.body.appendChild(a);
        a.click();
        document.body.removeChild(a);
      },

      rightBtnFn(data) {
        this.signDialogShow = true;
      },
    },
    components: { formCommon },
  };
</script>

<style lang="scss" scoped>
  ::v-deep .el-form .el-form-item__label {
    padding-left: 0;
  }
  ::v-deep .el-link span {
    font-size: 16px;
  }
</style>
